<template>
  <el-dialog title="新增分组" :visible.sync="open" width="600px" append-to-body>
    <el-form ref="formRefs" :model="form" label-width="120px">
      <el-row>
        <el-col :span="20" :offset="2">
          <el-form-item label="分组名称" prop="name" :rules="[{ required: true, message: '请输入分组名字' }]">
            <el-input placeholder="请输入分组名字" v-model="form.name" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer">
      <el-button @click="open = false">取 消</el-button>
      <el-button type="primary" @click="handlerOk" :loading="loading">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import { addApproveGroup } from '@/pages/views/approval/service'
  export default {
    name: 'AddModal',
    data() {
      return {
        open: false,
        loading: false,
        form: {}
      }
    },
    methods: {
      handlerOk() {
        this.$refs.formRefs.validate(err => {
          if (!err) return
          addApproveGroup(this.form).then(res => {
            if (res.code !== 200) return this.$message.error(res.message || '新增失败')
            this.$message.success('新增成功')
            this.open = false
          })
        })
      }
    }
  }
</script>

<style scoped></style>
